<?php
	echo $this->Html->css('postMessage');
?>
<script>
	$(document).ready(function(){
		var user_id = <?php echo $_SESSION['userid']; ?>;
		var friendGetted = false;

		function getThread(){

			$.get(
				"<?php echo $this->Html->url(array('controller'=>'messages','action'=>'thread')); ?>",
				function(data){

					data = JSON.parse(data);
					if (data.length == 0) return;
					var threadList = new Array();

					for (var key in data) {
						var user = (data[key]['user1']['id'] == user_id)?data[key]['user2']:data[key]['user1'];
						threadList.push('<div class="thread" threadid="'+data[key]['Thread']['id']+'" userid="'+user['id']+'"><img class="theadHead" src="'+user['url']+'"/><div class="threadTitle">与 '+ user['username'] +' 的对话</div><div class="clearFix"></div></div>');
					}

					$("#address").empty().append(threadList.join(''));

					$(".thread").click(function(){
						$(".thread").removeClass('threadFocus');
						$(this).addClass('threadFocus');
						getDetail($(this).attr('threadId'));
					});

				}
			);

		}

		function getDetail(id){
			$.get(
				"<?php echo $this->Html->url(array('controller'=>'messages','action'=>'detail')); ?>/"+id,
				function(data){

					data = JSON.parse(data);
					var messageList = new Array();
					for (var key in data) {
						var user = data[key]['user'];
						var message = data[key]['Message'];
						messageList.push('<div class="message"><img class="messageHead" src="'+user['url']+'" width="32" /><div class="messageTime">'+message['createdTime']+'</div><div class="messageContent">'+message['content']+'</div><div class="clearFix"></div></div>');
					}

					$("#messageList").empty().append(messageList.join(''));

				}
			);
		}

		function getFollow(){
			$.get(
				"<?php echo $this->Html->url(array('controller'=>'messages','action'=>'follow')); ?>/",
				function(data){

					data = JSON.parse(data);
					if (data.length == 0) return ;
					var followList = new Array();
					for (var key in data) {
						var user = data[key]['User'];
						followList.push('<li userid="'+user['id']+'" userurl="'+user['url']+'" username="'+user['username']+'" class="follows"><img src="'+user['url']+'" class="followHead"/><br /><span class="followName">'+user['username']+'</span></li>');
					}

					$("#followList").empty().append(followList.join(''));
					$(".follows").click(function(){
						$("#toUserHead").attr('src',$(this).attr('userurl'));
						$("#toUsername").text($(this).attr('username'));
						$('#toUserId').val($(this).attr('userid'));
					})

				}
			);
		}

		$("#postReply").click(function(){
			var target = $(".threadFocus");
			if (target.length == 0){
				alert("当前没有可回复的用户。");
			} else {
				var content = $("#replayContent").val();
				if (content.length == 0){
					alert("您没有输入内容。");
					return;
				}else{
					$.post("<?php echo $this->Html->url(array('controller'=>'messages','action'=>'post')); ?>/"+target.eq(0).attr('userid'),
						{'data[Message][content]':content},
						function(data){
							data = JSON.parse(data);
							if (data['result'] == true){
								alert('发送成功。');
								$("#replayContent").val("");
								getDetail(target.eq(0).attr('threadid'));
							}
							else{
								alert('发送失败。');
							}
						}
					);
				}
			}
		});

		$("#sendButton").click(function(){
			var sendContent = $("#sendContent").val();
			if (sendContent.length == 0) {
				alert("还没有写信息呢！");
				return;
			}
			var userId = $("#toUserId").val();
			if (userId == "") {
				alert("还没有选中发给谁呢！");
				return;
			}

			$.post("<?php echo $this->Html->url(array('controller'=>'messages','action'=>'post')); ?>/"+userId,
				{'data[Message][content]':sendContent},
				function(data){
					data = JSON.parse(data);
					if (data['result'] == true){
						alert('发送成功。');
						$("#sendContent").val("");
					}
					else{
						alert('发送失败。');
					}
				}
			)

		})

		$("#viewLetter").click(function(){
			$("#chatWindow").show();
			$("#address").show();
			$("#followList").hide();
			$("#sendBox").hide();
		});

		$("#viewFriend").click(function(){
			$("#chatWindow").hide();
			$("#address").hide();
			$("#followList").show();
			$("#sendBox").show();
			if (friendGetted == false)
				getFollow();
			friendGetted = true;
		})

		$(".postTabs").click(function(){
			$(".postFocus").removeClass("postFocus");
			$(this).addClass("postFocus");
		})

		getThread();
	})
</script>
<div id="postMessage">
	<div id="postTab">
		<div id="viewLetter" class="postTabs postFocus">收信</div><div id="viewFriend" class="postTabs">写信</div>
	</div>
	<div id="address"><div>暂无会话</div></div>
	<div id="chatWindow">
		<div id="messageList"></div>
		<form id="replyBox" onsubmit="return false;">
			<textarea id="replayContent" placeholder="请输入回复"></textarea><br />
			<button id="postReply">回复</button>
		</form>
	</div>
	<div id="followList"><div class="noContent">还没有好友，去添加吧</div></div>
	<div id="sendBox">
		<form id="send" onsubmit="return false;">
			<span>发送给：</span>
			<input id="toUserId" type="hidden" value="" />
			<div id="toUser">
				<img id="toUserHead"></img>
				<div id="toUsername">未选择用户</div>
			</div>
			<textarea id="sendContent" placeholder="请输入内容"></textarea>
			<button id="sendButton">发送</button>
		</form>
	</div>
	<div class="clearFix"></div>
</div>